<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.25" charset="UTF-8">
    <title>Title</title>
    <link rel="StyleSheet" href="/css/jpetstore.css" type="text/css" media="screen"/>
</head>
<body>
<div th:replace="common/top">

</div>
<div id="Content">
    <div id="BackLink">
        <!-- 此处的href的链接对应的是controller中的方法 -->
        <a href="/catalog/view">Return to Main Menu</a>
    </div>
    <div id="Catalog">

        <h2 th:text="${category.categoryName}">Category Name</h2>

        <table>
            <tr>
                <th>Product ID</th>
                <th>Name</th>
            </tr>

            <tr th:each="product:${category.productList}">
                <td><a th:href="@{/catalog/viewProduct?productId=}+${product.productId}" th:text="${product.productId}">Product
                    ID</a></td>
                <td th:text="${product.name}">Product Name</td>
            </tr>
        </table>
    </div>

</div>
<div th:replace="common/bottom"></div>

<!--脚本-->
<script th:src="@{/js/background.js}" count="500"></script>
</body>
</html>